<!doctype html>
<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <title>享送小哥</title>
    <link rel="stylesheet" type="text/css" href="../css/aui.css" />
    <link rel="stylesheet" type="text/css" href="../css/style.css" />
    <style>
        .no-login {
            text-align: center;
            font-size: .7rem;
            line-height: 1rem;
            width: 60%;
            position: fixed;
            top: 50%;
            left: 20%;
            margin-top: -2.5rem;
            height: 5rem;
        }
    </style>
</head>

<body>
    <div id="statusBar"></div>
    <div class="vue">
        <aside id="popup1" v-if="isLogin">
            <a href="javascript:;" class="sidebar1-top" @click="editUserinfo">
                <img :src="avatar" class="sidebar1-user aui-margin-l-10 aui-margin-r-10">
                <div class="user-modify">{{nickname}}<img src="../images/bi.png"></div>
                <p v-text="phone"></p>
                <span v-if="isCompany" style="font-size:0.5rem;background:#d8c910;color:#fff;border-radius:2px;padding:1px 5px;">企业用户</span>
            </a>
            <div class="aui-content">
                <ul class="aui-list aui-list-in side-list">
                    <li class="aui-list-item">
                        <a href="javascript:;" @click="myOrder">
                            <div class="aui-list-item-label-icon side-bg1"></div>
                            <div class="aui-list-item-inner">我的订单</div>
                        </a>
                    </li>
                    <li class="aui-list-item">
                        <a href="javascript:;" @click="myAddress">
                            <div class="aui-list-item-label-icon side-bg2"></div>
                            <div class="aui-list-item-inner">我的地址</div>
                        </a>
                    </li>
                    <li class="aui-list-item">
                        <a href="javascript:;" @click="myCoupon">
                            <div class="aui-list-item-label-icon side-bg3"></div>
                            <div class="aui-list-item-inner">我的优惠券</div>
                        </a>
                    </li>
                    <!-- <li class="aui-list-item">
                        <a href="javascript:;">
                            <div class="aui-list-item-label-icon side-bg4"></div>
                            <div class="aui-list-item-inner">邀请得奖励</div>
                        </a>
                    </li> -->
                    <li class="aui-list-item">
                        <a href="javascript:;" @click="installDriverApp">
                            <div class="aui-list-item-label-icon side-bg5"></div>
                            <div class="aui-list-item-inner">申请快乐享送人</div>
                        </a>
                    </li>
                    <!-- <li class="aui-list-item">
                        <a href="">
                            <div class="aui-list-item-label-icon side-bg6"></div>
                            <div class="aui-list-item-inner">常见问题</div>
                        </a>
                    </li> -->
                    <li class="aui-list-item">
                        <a href="javascript:void(0);" @click="feedback">
                            <div class="aui-list-item-label-icon side-bg7"></div>
                            <div class="aui-list-item-inner">联系客服</div>
                        </a>
                    </li>
                    <li class="aui-list-item">
                        <a href="javascript:;" @click="setting">
                            <div class="aui-list-item-label-icon side-bg8"></div>
                            <div class="aui-list-item-inner">设置</div>
                        </a>
                    </li>
                    <li class="aui-list-item">
                        <a href="javascript:;" @click="logout">
                            <div class="aui-list-item-label-icon side-bg9"></div>
                            <div class="aui-list-item-inner">退出</div>
                        </a>
                    </li>
                </ul>
            </div>
        </aside>
        <div v-else>
            <div class="no-login">
                <div class="his-text">
                    <p>当前还未登录哦~</p>
                    <p>登录后可查看并使用历史记录</p>
                </div>
                <div class="aui-btn aui-btn-info aui-btn-outlined aui-btn-sm u-btn2 aui-margin-t-10" @click="login">去登录</div>
            </div>
        </div>
    </div>

    <script type="text/javascript" src="../script/jquery-1.7.1.min.js"></script>
    <script type="text/javascript" src="../script/api.js"></script>
    <script type="text/javascript" src="../script/vue.js"></script>
    <script type="text/javascript" src="../script/app.js"></script>
    <script type="text/javascript">
        apiready = function() {

            //登录成功监听事件
            app.addEventListener('loginSuccess', function(data, error) {
                vObj.getUserInfo();
            })

            //退出登录监听时间
            app.addEventListener('logout', function(data, error) {
                vObj.isLogin = false;
                $api.rmStorage('is_login');
            });

            vObj = new Vue({
                el: ".vue",
                data: {
                    userInfo: [],
                    nickname: "",
                    phone: "",
                    isCompany: false,
                    avatar: "../images/user.png",
                    isLogin: false
                },
                methods: {
                    //获取用户信息
                    getUserInfo: function() {
                        var that = this;
                        app.request.get('Client/user', function(res) {
                            if (res.code == 200) {
                                that.isLogin = true;
                                that.nickname = res.data.user.name;
                                that.phone = res.data.user.phone;
                                that.avatar = res.data.user.avatar;
                                that.isCompany = res.data.user.is_company ? true : false;
                                that.userInfo = res.data.user;
                            } else {
                                that.isLogin = false;
                            }
                        })
                    },
                    editUserinfo: function() {
                        app.page({
                            name: 'user_info',
                            url: 'user_info.html',
                            pageParam: {
                                userInfo: this.userInfo
                            }
                        })
                    },
                    login: function() { //登录
                        app.page({
                            name: 'login0',
                            url: 'login0.html'
                        })
                    },
                    myOrder: function() { //我的订单
                        app.page({
                            name: 'my_order',
                            url: 'my_order.html'
                        })
                    },
                    myAddress: function() { //我的地址
                        app.page({
                            name: 'my_address',
                            url: 'my_address.html'
                        })
                    },
                    myCoupon: function() { //我的优惠券
                        app.page({
                            name: 'my_coupon',
                            url: 'my_coupon.html'
                        })
                    },
                    installDriverApp: function() {
                        api.confirm({
                            msg: '需要安装享送小哥配送端App',
                            buttons: ['取消', '去安装']
                        }, function(ret, err) {
                            var index = ret.buttonIndex;
                            if (index == 2) {
                                api.showProgress({
                                    title: '正在打开...',
                                    text: '请稍候...',
                                    modal: false
                                });
                                app.request.post('Common/version', {}, {}, function(res) {
                                    var url, type
                                    if (api.systemType == 'ios') {
                                        version = res.data.driver.ios.version
                                        url = res.data.driver.ios.url
                                        type = 'ios'
                                    } else {
                                        version = res.data.driver.android.version
                                        url = res.data.driver.android.url
                                        type = 'android'
                                    }
                                    api.openWin({
                                        name: 'download_driver_app',
                                        url: 'download_driver_app.html',
                                        pageParam: {
                                            type: type,
                                            version: version,
                                            url: url
                                        }
                                    });
                                    api.hideProgress();
                                })
                            }
                        });
                    },
                    feedback: function() { //意见反馈
                        app.page({
                            name: 'feedback',
                            url: 'feedback.html'
                        })
                    },
                    setting: function() { //设置
                        app.page({
                            name: "setting",
                            url: "./setting.html"
                        });
                    },
                    logout: function() { //退出登录
                        var that = this;
                        app.request.get('Client/logout', function(res) {
                            if (res.code == 200) {
                                api.sendEvent({
                                    name: 'logout'
                                });
                                api.closeDrawerPane();
                            }
                        });
                    }
                }
            });
            vObj.getUserInfo();
        }
    </script>

</body>

</html>
